<template>
	<div class="page">
		<div class="page-body">
			<div class="active-box">
				<div class="active-center">
					  <div class="active-top">
					  	   <img src="../assets/img/back.png" />
						   <span @click="back">&nbsp;返回</span>
					  </div>
					  <div class="new">
						  <h3>标题内容</h3>
						  <p>
							          2016年7月13日，国务院新闻办公室召开《中国坚持通过谈判解决中国与菲律宾在南海的有关争议》白皮书发布会，介绍中国在南海问题的政策立场。国务院新闻办公室副主任、新闻发言人郭卫民介绍，《中国坚持通过谈判解决中国与菲律宾在南海的有关争议》白皮书共包括五个部分内容：
							  　　一是南海诸岛是中国固有领土，强调中国对南海诸岛的主权是历史上确定的，中国始终坚持维护在南海的领土主权和海洋权益，中国对南海诸岛的主权得到国际社会的广泛承认。					  
							  　　二是中菲南海有关争议的由来。强调菲律宾非法侵占行为制造了中菲南沙岛礁争议，菲律宾对南沙群岛部分岛礁的领土主张毫无根据，指出国际海洋法制度的发展导致中菲出现海洋划界争议。				  
							  　　三是中菲已就解决南海有关争议达成共识，强调通过谈判解决有关争议是中菲共识和承诺，妥善管控南海有关争议是中菲之间的共识。				  
							  　　四是菲律宾一再采取导致争议复杂化的行动，这部分指出菲律宾企图扩大对中国南沙群岛部分岛礁的侵占，一再扩大海上侵权，企图染指中国黄岩岛，强调菲律宾单方面提出仲裁是恶意行为。
							  　　五是中国处理南海问题的政策，就南沙群岛领土问题、南海海洋划界问题、争端解决方式、在南海管控分歧和开展海上务实合作、南海航行自由和安全、共同维护南海和平与稳定等方面阐述中国的政策主张。白皮书还原中菲南海有关争议的事实真相，重申中国在南海问题上的一贯立场和政策，溯本清源，以正视
							  　　郭卫民介绍，白皮书共计2万余字，以中文、英文、俄文、法文、德文等多语种发表，中文版和各外文版即将在全国新华书店发行。中国人民在南海的活动已有两千多年历史。菲律宾单方面提出南海仲裁，临时仲裁庭违法仲裁，是一场披着法律外衣精心包装的政治闹剧，改变不了南海诸岛是中国固有领土这一事实。中国维护国家领土主权和海洋权益的决心和意志坚如磐石。
						  </p>
						 
						  
					  </div>
				</div>
				
			</div>
		</div>
		<div class="footer">
			  <div class="line-f"></div>
			  <div class="footer-last">
				  <div class="footer-left">
					 <router-link to="/" >更多支持</router-link>
					 &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
					 <router-link to="/" >帮助中心</router-link>
				  </div>
				  <div class="footer-right">
			            <div class="footer-logo">
							<div class="logo-box-f "><img src="../assets/img/redpanda-logo2.png"/></div>
							<div class="logo-box-h "><img src="../assets/img/REDPANDADAO.png"/></div>
						</div>
						<div class="footer-btn">
							 <router-link to="/" ><img src="../assets/img/discord.png"/></router-link>
							 <router-link to="/" ><img src="../assets/img/telegram.png"/></router-link>
							  <router-link to="/" ><img src="../assets/img/twitter.png"/></router-link>
						</div>
				  </div>
			  </div>
		</div>
	</div>
</template>

<script>
	import Header from '../components/Header.vue'
	export default {
		components: {
			Header
		},
		data(){
			return{
				newsId:''
			}
		},
		methods:{
			back:function(){
				this.$router.push({
					path:"/activity"
				})
			}
		},
		mounted(){
			this.newsId = this.$route.query.id
      this.$store.state.navState = 1;
		}
	
	}
</script>

<style scoped>
	.page{
		 background-color: #eee;
		 height: 100%;
	}
	.page-body {
		width: 100%;
		min-height: 100%;
		padding-left: 80px;
		padding-right: 80px;
		box-sizing: border-box;
		overflow:hidden ;
	}
	
	.wecome-box {
		width: 100%;
		padding-top: 30px;
		overflow: hidden;
	}
	
	.text {
		float: left;
		width: 60%;
		color: #fff;
	}
	
	.title {
		font-size: 32px;
		font-weight: bold;
		letter-spacing: 2px;
		text-align: left;
		margin-top: 20px;
	}
	
	.content-text {
		font-size: 18px;
		font-style: normal;
		text-indent: 2em;
		letter-spacing: 1px;
		text-align: left;
		line-height: 25px;
		margin-top: 40px;
		word-wrap: break-word;
		padding-bottom: 80px;
	
	}
	
	.img-box {
		float: left;
		width: 40%;
		position: relative;
	}
	
	.img-box img {
		height: 400px;
		position: absolute;
		right: 80px;
		top: -80px;
		cursor: pointer;
	}
	
	.active-box {
		width: 100%;
		background-color: #000;
		box-sizing: border-box;
		margin-top: 50px;
	}
	
	.active-header {
		width: 100%;
		height: 80px;
	
	}
	
	.line-box {
		height: 2px;
		margin-top: 39px;
		background-color: #fff;
		width: 40%;
		float: right;
	}
	
	.left {
		float: left !important;
	}
	
	.active-title {
		width: 20%;
		float: left;
		line-height: 80px;
		height: 80px;
		font-size: 28px;
		font-weight: bold;
		color: #fff;
		text-align: center;
	}
	
	.active-title .text-s {
		margin-top: -40px;
		display: inline-block;
		line-height: 40px;
	}
	
	.ll {
		height: 28px;
		width: 2px;
		display: inline-block;
		background-color: #fff;
		margin-left: 20px;
		margin-right: 20px;
		line-height: 0px;
	}
	
	.active-center {
		width: 100%;
		background-color: #fff;
		padding-left: 1%;
		padding-right: 1%;
		box-sizing: border-box;
		overflow: hidden;
		padding: 50px;
	}
	
	.active{
		 width: 33.3%;
		 float: left;
		 padding-right: 3% ;
		 padding-left: 3%;
		 box-sizing: border-box;
		 cursor: pointer;
		 
	}
	.a-img-box{
		 width: 100%;
	}
	.a-img-box img{
		 width: 100%;
	}
	.active-footer{
		margin-top: 20px;
		width: 100%;
		background-color: #fff;
		margin-bottom: 100px;
		padding: 20px;
		box-sizing: border-box;
	}
	.act-tit {
		 font-size: 18px;
		 color: #000000;
		 text-align: left;
		 margin: 0px;
	}
	.act-cent{
		 font-size: 16px;
		 color: #666;
		 text-align: left;
		 text-indent: 2em;
	}
	.time {
		 text-align: right;
		 color: #888;
		 margin-bottom: 0px;
	}
	.line{
		 width: 100%;
		 background-color: #fff;
		 height: 2px;
		 margin-bottom: 50px;
	}
	.line-f{
		width: 100%;
		background-color: #fff;
		height: 2px;
	}
	.link-box{
		 width: 100%;
		 margin-bottom: 50px;
	}
	.link-title {
		font-size: 30px;
		color: #fff;
		text-align: left;
	}
	.links{
		 font-style: normal;
		 list-style: none;
		 display: flex;
		 flex-direction: row;
		 margin-top: 30px;
		 padding: 0px;
	}
	.link{
		 flex: 1;
		/* //background-color: #fff; */
		 margin-right: 40px;
		 cursor: pointer;
	}
	.link img {
		 width: 80%;
		 margin: auto;
	}
	.footer-last{
		 width: 100%;
		 padding-left: 20px;
		 padding-right: 40px;
		 box-sizing: border-box;
		 overflow: hidden;
	}
	.footer{
		 width: 100%;
		 height: 100px;
		 overflow: hidden;
		 background-color: #DDDDDD;
		 position: fixed;
		 bottom: 0px;
	}
	.footer-left {
		 float: left;
		 width: 400px;
		 
	}
	.footer-left a{
		 font-size: 20px;
		 font-weight: bold;
		 line-height: 100px;
		 color: #666666;
	}
	.footer-right {
		 float: right;
		height: 100px;
	}
	.footer-logo{
		 float: left;
		 height: 100px;
		  margin-top: 30px;
	}
	.logo-box-f{
		 float: left;
		
	}
	.logo-box-f img{ 
		height: 40px;
	}
	.logo-box-h img{
		height: 40px;
	}
	.logo-box-h{
		 float: left;
	}
	.footer-btn{
		float: left;
		display: flex;
		flex-direction: row;
		margin-top: 30px;
	}
	.footer-btn a{
		 flex: 1;
		 margin-left: 30px;
	}
	.active-top{
		color: #444;
		text-align: left;
		line-height: 40px;
		font-size: 20px;
		font-weight: bold;
		cursor: pointer;
	}
	.active-top img{
	  float: left;	
	  height: 20px;
	  margin-top: 10px;
	}
	.new{
		 color: #444;
	}
</style>
